$(function () {

    //用来定义当前是第几页
    let cPage = 1;
    //用来定义一共有多少页
    let totalPage = 1;
    //获取所有分类
    $.ajax({
        url: BigNew.category_list,
        type: 'get',
        dataType: 'json',
        success: function (backData) {
            console.log(backData);
            //模板引擎渲染页面 
            $('#selCategory').html(template('category_list', backData));
        }
    });
    //获取文章列表，
    init();


    //点击筛选按钮时，根据条件筛选文章类型
    $("#btnSearch").click(function (e) {
        e.preventDefault();
        $.ajax({
            method: 'GET',
            url: BigNew.article_query,
            data: {

                perpage: 10,
                //表单元素的val默认指的是value属性，不是text
                type: $('#selCategory').val(),
                state: $('#selStatus').val(),
            },
            success: (res) => {
                console.log(res);

                const article_list = template("article_list", { data: res.data.data });

                $("tbody").html(article_list);
            }
        })
    })
    //把文章获取的方法封装到init函数里面，分页器点击的时候需要用到ajax获取数据渲染页面。
    function init() {
        $.ajax({
            method: 'GET',
            url: BigNew.article_query,
            data: {
                page: cPage,
                perpage: 10,
                /*
                    1.表单元素的val默认指的是value属性，不是text。
                    2.每次获取文章都要根据筛选按钮的value来获取
                    3.select组件只会获取一个value就是当前选择的option的value
                */
                type: $('#selCategory').val(),
                state: $('#selStatus').val(),
            },
            success: (res) => {
                console.log(res);

                const article_list = template("article_list", { data: res.data.data });

                $("tbody").html(article_list);

                totalPage = res.data.totalPage;
                // console.log(totalPage);
                setPage();
            }
        })
    }


    //把分页器的功能进行封装，需要时进行调用
    function setPage() {
        $(".pagination").bootstrapPaginator({
            //设置版本号
            bootstrapMajorVersion: 3,
            // 显示第几页
            currentPage: cPage,
            // 总页数
            totalPages: totalPage,
            //当单击操作按钮的时候, 执行该函数, 调用ajax渲染页面
            alignment: "right",
            //分页器点击事件的触发，这几个参数是规定的。page是当前的页面。
            onPageClicked: function (event, originalEvent, type, page) {

                // 把当前点击的页码赋值给currentPage, 调用ajax,渲染页面
                cPage = page

                //这句话的意思是，如果有这个函数就执行。
                init && init();
            }
        })
    }

    $("tbody").on("click", ".delete", function () {
        $.ajax({
            method: 'POST',
            url: BigNew.article_delete,
            data: { id: $(this).attr("data-id") },
            success: (res) => {
                console.log(res);
                alert(res.msg);
                window.location.reload();
            },
            error: (res) => {
                alert(res.msg);
            }
        })
    })
})